.category-container {
  background: #fff;
  display: flex;
}

.category-left-view {
  width: 220rpx;
  height: 100vh;
  .left-view-item {
    line-height: 99rpx;
    text-align: center;
    font-size: 26rpx;
  }
  .active {
    background-color: #ffffff;
    position: relative;
    color: #f3514f;
    &::before {
      content: "";
      display: block;
      width: 6rpx;
      height: 66rpx;
      background-color: #f3514f;
      position: absolute;
      left: 0;
      top: 50%;
      transform: translateY(-50%);
    }
  }
}

.category-right-view {
  height: 100vh;
  margin-left: 8rpx;
  .right-view-item {
    width: 33%;
    float: left;
    margin-top: 30rpx;
    .navigator {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    image {
      width: 90rpx;
      height: 90rpx;
    }
    text {
      font-size: 26rpx;
      margin-top: 18rpx;
    }
  }
}